{#1、继承父类的基本结构#}
{% extends 'demo/base.html' %}
{% load common_extras %}
{#2、重写页面个性化内容#}
{#重写标题#}
{% block title %}
    {{ now_cls|capfirst }}博客-专业IT技术发表平台
{% endblock %}
{#重写头部#}
{% block header %}
    {% include 'demo/header.html' %}
{% endblock %}
{#重写内容部分#}
{% block main %}
    {% include 'demo/classes.html' %}
    {% if articles %}
        <ul class="navs">
            {% for article in articles %}
                <li>
                    <a href="{{ article.content }}">
                        <div class="left">
                            <img src="{{ article.cover }}"/>
                        </div>
                        <div class="right">
                            <h4>{{ forloop.counter }}、{{ article.title }}</h4>
                            <p>
                                {{ article.desc }}
                            </p>
                            <p class="info">发布时间：{{ article.create_time|time_since }}</p>
                        </div>
                    </a>
                </li>
                {% if forloop.last %}
                    <div class="bottom-info">已经到底啦~</div>
                {% endif %}
            {% endfor %}
        </ul>
        {#    否则就显示暂无文章#}
    {% else %}
        <div class="bottom-info">
            暂无文章
        </div>
    {% endif %}
{% endblock %}